<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>作业1</title>
		
	</head>
	<script src="../js/jquery-1.11.1.js"></script>
	<style>
		button{
			margin: 4px 2px;
			padding: 14px 27px;
			border: none;
		}
		#target{
			width: 400px;
			height: 250px;
			background-color:#fff782;
			margin: -20px 1px;
			line-height: 250px;
			text-align: center;
		}
	</style>
	<body>
		<button id="btn1">tab01</button>
		<button id="btn2">tab02</button>
		<button id="btn3">tab03</button>
		<div id="target"><p>tab文本内容一</p></div>
		<script>
			$("#btn1").click(function(){
				$("#btn1").css("background-color" ,"#fff782");
				$("#btn2").css("background-color" ,"");
				$("#btn3").css("background-color" ,"");
				$("p").text("tab文本内容一");
			});
			$("#btn2").click(function(){
				$("#btn2").css("background-color" ,"#fff782");
				$("#btn1").css("background-color" ,"");
				$("#btn3").css("background-color" ,"");
				$("p").text("tab文本内容二");
			});
			$("#btn3").click(function(){
				$("#btn3").css("background-color" ,"#fff782");
				$("#btn2").css("background-color" ,"");
				$("#btn1").css("background-color" ,"");
				$("p").text("tab文本内容三");
			});
		</script>
	</body>
</html>